---
title: Composition
---

import { Code } from "@radix-ui/themes";

`assistant-ui` primitives are composable. This means that all props are forwarded, classes are merged, and event handlers are chained.

Most primitives come with a default HTML element (usually `div` or `button`). If you already have a custom component, you can use the `asChild` prop to replace it:

```tsx
// use the primitive's <button> element
<Composer.Send>Send</Composer.Send>;

// use your own <Button> component
<Composer.Send asChild>
  <Button>Send</Button>
</Composer.Send>;
```

Learn more on [Radix's composition guide](https://www.radix-ui.com/primitives/docs/guides/composition).
